<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>模拟数据生成器</title>
    <link rel="stylesheet" href="elementUI/css/index.css">
</head>
<body>
<div id="app">
    <el-row>
        <el-col :span="12"><div class="grid-content bg-purple">
                <el-form ref="form" :model="form" label-width="80px">
                    <el-form-item label="活动名称">
                        <el-input
                                type="textarea"
                                :rows="20"
                                placeholder="请输入内容"
                                v-model="form.jsonStr">
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="simulationData">立即生成</el-button>
                    </el-form-item>
                </el-form>
            </div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">
                <el-form ref="form" :model="form" label-width="80px">
                    <el-form-item label="结果">
                        <el-input
                                type="textarea"
                                :rows="20"
                                placeholder="请输入内容"
                                v-model="form.resultStr">
                        </el-input>
                    </el-form-item>
                </el-form>
            </div></el-col>
    </el-row>
</div>

<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript" src="elementUI/index.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>

<script>
    var vm = new Vue({
        el: '#app',
        data () {
            return {
                form: {
                    // jsonStr: {
                    //     outputType: "sql",    // 输出类型
                    //     frequency: 50,  // 次数
                    //     tableName: "test", // 输出sql语句的表名
                    //     data: { // 数据, K:字段名称， V：值或内置函数, 需加""
                    //         id: "getId(2, 18)", // id生成器, type
                    //         name: "randomStr(2, 2-3)", // 随机字符串生成器
                    //         type: "[1,2,3,4]",   // 数组，随机获取数组中的一个值
                    //         age: "15"   // 固定值
                    //     },
                    // dataType:{
                    // id: int,
                    // name: int,
                    // type: int,
                    // age: int
                    // }
                    // },
                    jsonStr: '{"outputType":"sql","frequency":50,"tableName":"test","data":{"id":"@getId(2, 18)","name":"@randomStr(2, 2-3)","type":[1,2,3,4],"age":"15"}}',
                    resultStr: ''
                }
            }
        },
        methods: {
            // 生成数据
            simulationData () {
                // 将json字符串转换为对象
                var jsonData = JSON.parse(this.form.jsonStr)
                // 输出结果
                var data = []
                console.log(parseInt(jsonData.frequency))
                for (var i = 0; i < parseInt(jsonData.frequency); i++) {
                    var singleStripData = {}
                    for (let key in jsonData.data) {
                        var v = jsonData.data[key]
                        // 判断v是数组还是字符串
                        if (typeof (v) === 'string') { // 字符串
                            if (v.indexOf('@getId') != -1) {
                                // 获取参数：
                                vm.getParams(v)
                                singleStripData[key] = vm.getUUID()
                            } else if (v.indexOf('@randomStr') != -1) {
                                singleStripData[key] = '获取随机字符'
                            } else {
                                singleStripData[key] = v
                            }
                        } else {
                            // 判断是否数组
                            if (v instanceof Array) {
                                singleStripData[key] = v[vm.randomNum(0, v.length - 1)]
                            }
                        }
                    }
                    data.push(singleStripData)
                }

                // 获取data
                console.log(jsonData)
                console.log(data)
            },
            randomNum (Min, Max) {
                var Range = Max - Min
                var Rand = Math.random()
                return (Min + Math.round(Rand * Range))
            },

            // 获取参数数组
            getParams(paramsStr) {
                var reg = '\\((.*?)\\)';
                var subStr = paramsStr.match(reg)
                if (subStr.length > 0) {
                    return (subStr[0].substring(1, subStr[0].length - 1)).split(',')
                } else {
                    return []
                }
            },

            // 生成uuid
            getUUID(){
                var s = [];
                var hexDigits = "0123456789abcdef";
                for (var i = 0; i < 36; i++) {
                    s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
                }
                s[14] = "4";
                s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
                s[8] = s[13] = s[18] = s[23] = "-";
                return s.join("");;
            },

            /**
             * 获取指定时间内的随机时间
             * @param start 范围起始: 'yyyy-MM-dd hh:mm:ss'
             * @param end   范围结尾: 'yyyy-MM-dd hh:mm:ss'
             * @param fmt 格式: 'yyyy-MM-dd hh:mm:ss'
             */
            randDateTime(start, end, fmt) {
                if (!fmt || fmt.trim().length <= 0) {
                    fmt = 'yyyy-MM-dd hh:mm:ss'
                }
                var startStamp = 0
                var endStamp = 0
                if (start instanceof Date) {
                    startStamp = start.getTime()
                } else {
                    startStamp = new Date(start).getTime()
                }
                if (end instanceof Date) {
                    endStamp = end.getTime()
                } else {
                    endStamp = new Date(end).getTime()
                }
                if (endStamp > startStamp) {
                    var sub = endStamp - startStamp
                    var rand = Math.floor(Math.random() * sub)
                    if (rand < 1) {
                        rand = 1
                    }
                    var randStamp = startStamp + rand
                    return formatDate(new Date(randStamp), fmt)
                } else {
                    return formatDate(new Date(), fmt)
                }
            },


        },
        mounted () {

        }
    })
</script>
</body>
